<script setup lang="ts">
import {ElIcon, ElTableColumn, ElTooltip} from "element-plus";
// import DevTableColumn from "./DevTableColumn.vue";
import {QuestionFilled} from "@element-plus/icons-vue";
import dayjs from 'dayjs';
import {useSlots} from "vue";
import {devIsRealNumber} from "@/utils";

const slots: Record<string, any> = useSlots();

const props = defineProps({
  item: {
    type: Object,
    default:  () => ({})
  },
  emptyText: {
    type: String,
    default:''
  }
});

/**
 * 计算时间
 */
const computingTime = (time: any, timeType: string = 'YYYY-MM-DD HH:mm:ss') => {
  if (time && time !== '0') {
    const multiple: number = 13 - (time.toString().length);
    if (multiple > 0) {
      return dayjs(time * (Math.pow(10, multiple))).format(timeType);
    } else {
      return dayjs(time * 1).format(timeType);
    }
  } else {
    return props.emptyText;
  }
};



/**
 * 金额格式化选项类型
 */
interface FormatMoneyOptions {
  symbol?: string;
  decimals?: number;
  rounding?: 'round' | 'floor' | 'ceil';
  showSymbol?: boolean;
  [key: string]: any;
}

/**
 * 计算金额
 */
const computingMoney = (money: any, item: FormatMoneyOptions) => {
  if (devIsRealNumber(money)) {
    const symbol = item.symbol ?? '¥';
    const decimals = item.decimals ?? 2;
    const rounding = item.rounding ?? 'round';
    const showSymbol = item.showSymbol !== false; // 默认 true

    const num = Number(money);
    const factor = Math.pow(10, decimals);

    let result: number;

    switch (rounding) {
      case 'floor':
        result = Math.floor(num * factor) / factor;
        break;
      case 'ceil':
        result = Math.ceil(num * factor) / factor;
        break;
      case 'round':
      default:
        result = Math.round(num * factor) / factor;
        break;
    }

    const formatted = result.toFixed(decimals);
    return showSymbol ? symbol + formatted : formatted;
  } else {
    return props.emptyText;
  }
};

/**
 * 判断数据类型是否为数字
 */
const isNumber = (val: any) => {
  const regPos = /^\d+(\.\d+)?$/; // 非负浮点数
  const regNeg = /^((-\d+(\.\d+)?)|(0+(\.0+)?))$/; // 负浮点数
  return regPos.test(val) || regNeg.test(val);
};

/**
 * 计算column中的值改展示什么
 */
const computingColumnValue = (row: any, column: any) => {
  if (column.dataType === 'time') {
    return computingTime(row[column.prop], column.timeType);
  } if(column.dataType ==='money'){
    return computingMoney(row[column.prop], column);
  } else if (isNumber(row[column.prop])) {
    return row[column.prop];
  } else{
    return row[column.prop] || props.emptyText;
  }
};
</script>

<template>
  <!--  有子项-->
  <el-table-column v-bind="props.item" v-if="!item.hide && item?.columns?.length>0">
    <template v-for="val in item.columns">
      <dev-table-column :item="val" :emptyText="props.emptyText">
        <!-- 插槽透传 -->
        <template v-for="(_, slotName) in slots" #[slotName]="scope:any">
          <slot :name="slotName" v-bind="scope"/>
        </template>
      </dev-table-column>
    </template>
  </el-table-column>
  <!--  无子项-->
  <el-table-column v-bind="props.item" v-else-if="!item.hide">
    <!--            表头-->
    <template #header v-if="!item.hide && (!item?.columns || item?.columns?.length===0)">
      <slot :item="item" :name="'header-'+item.prop">
        <template v-if="item?.tips">
          {{ item.label }}
          <el-tooltip :effect="item.effect?item.effect:'dark'" :content="item.tips" placement="top">
            <el-icon style="vertical-align: -1px;">
              <QuestionFilled/>
            </el-icon>
          </el-tooltip>
        </template>
        <template v-else>{{ item.label }}</template>
      </slot>
    </template>
    <!--            内容-->
    <template #default="scope" v-if="!item.hide && (!item?.columns || item?.columns?.length===0) && !['index'].includes(item.type)">
      <slot :item="scope.row" :name="item.prop" v-bind="scope">
        {{ computingColumnValue(scope.row, item) }}
      </slot>
    </template>
  </el-table-column>

</template>
<style scoped lang="scss">

</style>
